
//用户信息
$('#user').hover(
  function () {
    $('.shift-5').animate({ opacity: 1 }, 150).addClass('open');
  },
  function () {
    $('.shift-5').animate({ opacity: 0 }, 150).removeClass('open');
  }
);

document.addEventListener('DOMContentLoaded', function () {
  var statusSwitch = document.querySelector('.status-switch');
  var userStatus = document.querySelector('.user-status');
  var inSchool = document.querySelector('.in-school');
  var outSchool = document.querySelector('.out-school');
  var busy = document.querySelector('.busy');
  var userName = document.querySelector('.user-name');
  var userStatusText = document.querySelector('.user-status span');
  var currentStatus = ''; // 初始化当前状态为空字符串，用于存储当前选中的状态值  

  // 为每个状态选项添加点击事件处理器  
  for (let i = 0; i < statusSwitch.children.length; i++) {
    let span = statusSwitch.children[i];
    span.addEventListener('click', function () {
      // 更新用户状态和页面显示  
      updateUserStatus(span.textContent);
    });
  }

  function updateUserStatus(status) {
    currentStatus = status;
    userStatusText.textContent = currentStatus;
    if (currentStatus === '在校') {
      inSchool.classList.add('active');
      outSchool.classList.remove('active');
      busy.classList.remove('active');
    } else if (currentStatus === '离校') {
      inSchool.classList.remove('active');
      outSchool.classList.add('active');
      busy.classList.remove('active');
    } else if (currentStatus === '勿扰') {
      inSchool.classList.remove('active');
      outSchool.classList.remove('active');
      busy.classList.add('active');
    }
  }
});

//商品分类
$('#sort').hover(
  function () {
    $('.shift-4').animate({ opacity: 1 }, 150).addClass('open');
  },
  function () {
    $('.shift-4').animate({ opacity: 0 }, 150).removeClass('open');
  }
);

//校区选择
$('#campusbox').hover(
  function () {
    $('.shift-3').animate({ opacity: 1 }, 150).addClass('open');
  },
  function () {
    $('.shift-3').animate({ opacity: 0 }, 150).removeClass('open');
  }
);

//模糊搜索
let keyword = document.querySelector('.keyword');
let searchHelper = document.querySelector('.search_helper')
定义数组存储搜索内容
fetch('http://127.0.0.1:8000/goodsapi/')  
  .then(response => response.json())  
  .then(data => {  
    console.log(data); // 打印获取到的数据  
  }) 
  .catch(error => console.error('Error:', error));
let searchArr = ['小米手机', '苹果手机'];
//改变事件
keyword.oninput = function () {
  searchHelper.innerHTML = '';
  for (let i = 0; i < searchArr.length; i++) {
    if (searchArr[i].indexOf(keyword.value) != -1) {
      searchHelper.innerHTML += '<p>' + searchArr[i] + '<p>';
      searchHelper.style.display = 'block';
    }
  }
}
keyword.onblur = function () {
  searchHelper.style.display = 'none';
};

//订单
//1.获取订单信息
function getOrderInfo() {
  fetch('http://127.0.0.1:8000/goodsapi/')
   .then(response => response.json())
   .then(data => {
      console.log(data); // 打印获取到的数据
    })
   .catch(error => console.error('Error:', error));
}
//const goodsList_wts = [
const goodsList_wts = [
  {
    id: '4001009',
    name: '竹制干泡茶盘正方形沥水茶台品茶盘',
    price: 109.8,
    picture: 'https://yanxuan-item.nosdn.127.net/2d942d6bc94f1e230763e1a5a3b379e1.png',
    count: 3,
    spec: { size: '40cm*40cm', color: '黑色' }
  },
  {
    id: '4001172',
    name: '称心如意手摇咖啡磨豆机咖啡豆研磨机',
    price: 289.9,
    picture: 'https://yanxuan-item.nosdn.127.net/84a59ff9c58a77032564e61f716846d6.jpg',
    count: 2,
    spec: { color: '白色' }
  },
  {
    id: '4001009',
    name: '竹制干泡茶盘正方形沥水茶台品茶盘',
    price: 109.8,
    picture: 'https://yanxuan-item.nosdn.127.net/2d942d6bc94f1e230763e1a5a3b379e1.png',
    count: 3,
    spec: { size: '40cm*40cm', color: '黑色' }
  },
  {
    id: '4001874',
    name: '古法温酒汝瓷酒具套装白酒杯莲花温酒器',
    price: 488,
    picture: 'https://yanxuan-item.nosdn.127.net/44e51622800e4fceb6bee8e616da85fd.png',
    count: 1,
    spec: { color: '青色', other: '一大四小' }
  },
  {
    id: '4001456',
    name: '竹制干泡茶盘正方形沥水茶台品茶盘',
    price: 109.8,
    picture: 'https://yanxuan-item.nosdn.127.net/2d942d6bc94f1e230763e1a5a3b379e1.png',
    count: 3,
    spec: { size: '40cm*40cm', color: '黑色' }
  },
  {
    id: '4001874',
    name: '古法温酒汝瓷酒具套装白酒杯莲花温酒器',
    price: 488,
    picture: 'https://yanxuan-item.nosdn.127.net/44e51622800e4fceb6bee8e616da85fd.png',
    count: 1,
    spec: { color: '青色', other: '一大四小' }
  }
]

const goodsList_wtb = [
  {
    id: '4001172',
    name: '称心如意手摇咖啡磨豆机咖啡豆研磨机',
    price: 289.9,
    picture: 'https://yanxuan-item.nosdn.127.net/84a59ff9c58a77032564e61f716846d6.jpg',
    count: 2,
    spec: { color: '白色' }
  },
  {
    id: '4001009',
    name: '竹制干泡茶盘正方形沥水茶台品茶盘',
    price: 109.8,
    picture: 'https://yanxuan-item.nosdn.127.net/2d942d6bc94f1e230763e1a5a3b379e1.png',
    count: 3,
    spec: { size: '40cm*40cm', color: '黑色' }
  },
  {
    id: '4001874',
    name: '古法温酒汝瓷酒具套装白酒杯莲花温酒器',
    price: 488,
    picture: 'https://yanxuan-item.nosdn.127.net/44e51622800e4fceb6bee8e616da85fd.png',
    count: 1,
    spec: { color: '青色', other: '一大四小' }
  },
  {
    id: '4001874',
    name: '古法温酒汝瓷酒具套装白酒杯莲花温酒器',
    price: 488,
    picture: 'https://yanxuan-item.nosdn.127.net/44e51622800e4fceb6bee8e616da85fd.png',
    count: 1,
    spec: { color: '青色', other: '一大四小' }
  }
]

//wts订单信息渲染
document.querySelector('.listening-sell').innerHTML = goodsList_wts.map(item => {
  const { picture, name, count, price, spec } = item
  const text = Object.values(spec).join('/')
  const subTotal = ((price * 100 * count) / 100).toFixed(2)
  return `
<div class="item">
<img src=${picture}>
<p class="name">${name}</p>
<p class="spec">${text}</p>
<p class="price">${price.toFixed(2)}</p>
<p class="count">x${count}</p>
<button class="buttons-chat">
  <i class="iconfont icon-session_huihua"></i>
</button>
<button class="buttons-copy" onclick="copyToClipboard('买')">
  <span>BUY</span>
</button>
</div>
`
}).join('')

//wtb订单信息渲染
document.querySelector('.listening-buy').innerHTML = goodsList_wtb.map(item => {
  const { picture, name, count, price, spec } = item
  const text = Object.values(spec).join('/')
  const subTotal = ((price * 100 * count) / 100).toFixed(2)
  return `
<div class="item">
<img src=${picture} alt="">
<p class="name">${name} </p>
<p class="spec">${text} </p>
<p class="price">${price.toFixed(2)}</p>
<p class="count">x${count}</p>
<button class="buttons-chat">
  <i class="iconfont icon-session_huihua"></i>
</button>
<button class="buttons-copy" onclick="copyToClipboard('卖')">
  <span>SELL</span>
</button>
</div>
`
}).join('')


//刷新订单


//点击按钮快捷喊话
var orderName = document.querySelector('.name').textContent;
function copyToClipboard(action) {
  var text = "我来自MUCmarket，我想" + action + orderName;
  navigator.clipboard.writeText(text).then(function () {
    console.log('复制成功！');
  }, function (err) {
    console.error('复制失败:', err);
  });
}  

//个人订单查看
//个人订单信息获取
function getOrderOwnInfo() {
  fetch('http://127.0.0.1:8000/goodsapi/')
   .then(response => response.json())
   .then(data => {
      console.log(data); // 打印获取到的数据
    })
   .catch(error => console.error('Error:', error));
}
//个人订单信息展示

